<div class="nav-top"></div>
<div class="personal-container">
  <div class="pc-width clearfix">
    <div class="left-menu fl">
      <div class="portrait">
        <img [src]="user.portrait" alt="">
      </div>
      <div class="menu">
        <a *ngFor="let menu of menus"
            routerLinkActive="active"
            [routerLinkActiveOptions]="{exact:true}"
            [routerLink]="menu.link">
          <span>{{menu.menu}}</span>
        </a>
      </div>
    </div>
    <div class="right-info fl">
      <div class="leaguer clearfix">
        <div class="say-hello fl">
          <span>{{hello}}</span>
          <span>{{user.name}}</span>
        </div>
        <div class="rent-info fl">
          <a href="javascript:;" (click)="goToMyBalanceView()">
            <p>我的余额</p>
            <span class="font_18">{{user.balance}}</span>
            <span>元</span>
          </a>
          <a href="javascript:;" (click)="goToMyScoreView()">
            <p>我的积分</p>
            <span class="font_18">{{user.score}}</span>
            <span>分</span>
          </a>
          <a href="javascript:;">
            <p>推荐码</p>
            <span class="font_18">{{user.invitation}}</span>
            <span></span>
          </a>
        </div>
        <div class="rent-date fr">
          <div class="date-pic">
            <img src="assets/images/personal/date.png">
          </div>
          <div class="date-info">
            <p><select name="department"
                       (change)="changeHouse()"
                       [(ngModel)]="currentId"
                       class="form-control">
              <option *ngFor="let item of contractList" [value]='item.id'>{{item.houseNo}}房</option>
            </select>
            <p>剩余租期<span>{{currentContract.remainingDays}}</span>天</p>
          </div>
        </div>
      </div>
      <router-outlet></router-outlet>
    </div>
  </div>
</div>
